<template>
  <!--会签管理-我的审批-付款计划详情弹窗-表单-->
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="disabled" class="scroll-view" style="height: 300px">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="选择项目" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
              
             <!-- <a-select :options="levelOneOptions" placeholder="请选择项目" v-model="model.projectId" @change="handleChange1">
             </a-select> -->
             
             <a-select :default-value="levelOneOptions[0]" placeholder="请选择项目"  @change="handleChange1">
               <a-select-option v-for="(item,index) in levelOneOptions" :key="item.value">
                 {{ item.label }}
               </a-select-option>
             </a-select>
             
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="选择部门" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
              <!-- <a-select :options="branchList" placeholder="请选择部门" v-model="model.branchId" @change="handleChange2">
              </a-select> -->
              
              <a-select v-model="secondCity" placeholder="请选择部门">
                <a-select-option v-for="(item,index) in branchList" :key="item.value">
                  {{ item.label }}
                </a-select-option>
              </a-select>
              
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="选择人员" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
              <a-select :options="staffList" placeholder="请选择人员" v-model="model.staffId">
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="审批序号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
              <a-select placeholder="请选择审批序号" :disabled="disabled" style="color: black;" v-model="model.status">
                <a-select-option value="0">未提交</a-select-option>
                <a-select-option value="1">审核中</a-select-option>
                <a-select-option value="2">已同意</a-select-option>
                <a-select-option value="3">已驳回</a-select-option>
                <a-select-option value="4">已撤销</a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="是否并行审核" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-radio-group v-model="model.userIdentity">
                <a-radio :value="0">是</a-radio>
                <a-radio :value="1">否</a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="审批节点人数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="approvNumber">
              <a-input :disabled="disabled" v-model="model.approvNumber" style="color: black;"
                placeholder="请输入标题"></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="20">
            <a-form-model-item label="是否需要上传修改附件功能" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-radio-group v-model="model.userIdentity">
                <a-radio :value="0">是</a-radio>
                <a-radio :value="1">否</a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>
<script>
  import {
    httpAction,
    getAction
  } from '@/api/manage'
  import {
    validateDuplicateValue
  } from '@/utils/util'

  export default {
    name: 'WtBrandForm',
    components: {},
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: true,
        required: false,
      },
    },
    data() {
      return {
        title: '撤销原因',
        model: {
          projectId:'',
          branchId:'',
          staffId:'',
        },
        levelOneOptions: [],
        branchList: [], //部门列表
        staffList:[], //人员列表
        visible1: false,
        labelCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 8
          },
        },
        wrapperCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 13
          },
        },
        model1: {
          feedback: '',
          id: '',
          status: '',
        },
        confirmLoading: false,
        validatorRules: {},
        
        // levelTwoOptions: [],
        // levelThreeOptions: [],
        treeData: [],
        // fileList: [],
        treeData1: [],
        treeData2: [],
        treeData3: [],
        id: '',
        ids: [],
        status: '',
        idss: '', //提交id
        url: {
          add: '/wtBrand/add',
          edit: '/wtBrand/edit',
          queryById: '/wtBrand/queryById',
        },
      }
    },
    computed: {
      formDisabled() {
        return this.disabled
      },
    },
    created() {
      //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model))
      
      this.getdata('onshow');
      
    },
    methods: {
      getdata(type){
        getAction(`/sys/sysDepart/getDepartByOrgType?orgType=1`).then((res) => {
          if (res.success) {
            this.treeData = []
            let treeList = res.result
            for (let a = 0; a < treeList.length; a++) {
              let temp = treeList[a]
              temp.isLeaf = temp.leaf
              this.treeData.push(temp)
            }
        
            this.levelOneOptions = [...this.treeData].map((v) => {
              return {
                ...v,
                value: v.id,
                label: v.departName,
              }
            })
            if(this.levelOneOptions && this.levelOneOptions.length>0){
              if(type === 'onshow'){
                this.model.projectId = this.levelOneOptions[0].value;
              }
              
            }
          }
        })
      },
      handleChange1(e){
        console.log(1,e,this.model.projectId)
        if(!!this.model.projectId){
          getAction(`/sys/sysDepart/getDepartListByParentId?parentId=${this.model.projectId}`).then((res) => {
            if (res.success) {
              this.treeData1 = []
              let treeList = res.result
              for (let a = 0; a < treeList.length; a++) {
                let temp = treeList[a]
                temp.isLeaf = temp.leaf
                this.treeData1.push(temp)
              }
              this.$nextTick(()=>{
                this.branchList = [...this.treeData1].map((v) => {
                  return {
                    ...v,
                    value: v.id,
                    label: v.departName,
                  }
                })
                if(this.branchList && this.branchList.length>0){
                  this.model.branchId = this.branchList[0].label;
                }
              })
              
            }
          })
        }
      },
      handleChange2(e){
        console.log(2,e,this.model.branchId)
        if(!!this.model.branchId){
          getAction(`/sys/sysDepart/getUsersByDepartId?id=${this.model.branchId}`).then((res) => {
            if (res.success) {
              this.branchList = [];
              this.treeData2 = []
              let treeList = res.result
              for (let a = 0; a < treeList.length; a++) {
                let temp = treeList[a]
                temp.isLeaf = temp.leaf
                this.treeData2.push(temp)
              }
              this.$nextTick(()=>{
                this.staffList = [...this.treeData2].map((v) => {
                  return {
                    ...v,
                    value: v.id,
                    label: v.departName,
                  }
                })
                if(this.staffList && this.staffList.length>0){
                  this.model.staffId = this.staffList[0].label;
                }
              })
              
            }
          })
        }
      },
      confirmPrivacy() {
        // console.log('同意了用户协议')
        // console.log(this.privacyDialogShow)l
        this.visible1 = false
        // console.log(this.privacyDialogShow)
      },
      cancelPrivacy() {
        // console.log('拒绝了用户协议')
        this.visible1 = false
      },
      edit(record) {
        // this.model = Object.assign({}, record)
        this.visible = true
        this.loadTree(record)
        this.id = record.id
        this.status = record.status
        // console.log('few',record);
      },
      loadTree(record) {
        var that = this
        getAction(`/wtCountersign/countersignMaterialStatement/queryByCountersignId?countersignId=${record.id}`).then(
          (res) => {
            if (res.success) {
              that.treeData1 = res.result
              // console.log('erferw',that.treeData1);
              this.model = that.treeData1
              this.treeData3 = res.result.list
              this.list = res.result.list
              this.ids = this.list.find((obj) => obj.status == '1')
              // console.log('dwaq1', this.ids);
              this.idss = this.ids.id
              // for (let a = 0; a < treeList1.length; a++) {
              //   // console.log('ewq2');
              //   let temp = treeList1[a]
              //   temp.isLeaf = temp.leaf
              //   that.treeData1.push(temp)
              // console.log('dwaq1',that.treeData1);
            }
          }
        )
      },
      add() {
        this.edit(this.modelDefault)
      },

      chexiao() {
        this.visible1 = true
      },
      bohui() {
        const that = this
        // 触发表单验证
        that.model1.id = that.idss
        that.model1.status = '3'
        // console.log('432', that.model1)
        // debugger
        if (!that.model1.feedback) {
          alert('审批意见不能为空,请填写')
        } else {
          httpAction('/countersign/wtCountersignProcess/submitExamineApprove', this.model1, 'POST')
            .then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
            })
        }
      },
      submit() {
        const that = this
        // 触发表单验证

        that.model1.id = that.idss
        that.model1.status = '2'
        // console.log('432', that.model1)
        // debugger
        if (!that.model1.feedback) {
          alert('审批意见不能为空,请填写')
        } else {
          httpAction('/countersign/wtCountersignProcess/submitExamineApprove', this.model1, 'POST')
            .then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
            })
        }

      },
    },
  }
</script>
<style scoped>
  .scroll-view {
    overflow: auto;
    overflow-y: scroll;
  }
</style>